//----------------------------------------------
// Footer
//---------------------------------------------- 
.footer {
  color: $color-white;
  background-color: $color-black;
  border-top: $border;

  &__container {
    margin-top: 3em;
  }

  &__tags {
    @extend %flex-center;
    @extend %no-list-style;

    flex-wrap: wrap;

    & > * {
      margin-bottom: 2em;

      &:not(:last-child) {
        margin-right: 1em;
      }
    }
  }

  &__link {
    font-size: $font-small;
    color: $color-white;
    transition: color 200ms ease-in-out;

    &:hover,
    &:active,
    &:focus {
      color: $color-grey;
    }
  }

  &__social {
    @extend %flex-center;
    @extend %no-list-style;

    & > *:not(:last-child) {
      margin-right: 0.75em;
    }

    a {
      font-size: 1.25em;
      color: $color-white;
    }
  }
}

//----------------------------------------------
// Flex based sticky footer
//---------------------------------------------- 
// body {
//   display: flex;
//   flex-direction: column;
//   min-height: 100vh;
// }

main {
  position: relative;
  // z-index: $z-1;

  // flex-grow: 1;
  margin-top: $header-height;
}
